<template>
	<view class="container">
		<view v-if="Array.isArray(lists) && lists.length">
			<view class="waterCell" v-for="item in lists" :key="item.id">
				<view class="waterCell-imageBox">
					<!-- <image :src="'../../../../static/c' + item.id + '.png'" mode="aspectFill">
				</image> -->
				</view>
				<text>{{item.content}}</text>
			</view>
		</view>
		<empty-page v-else :hideIcon='true'></empty-page>
	</view>
</template>

<script setup>
	const lists = []
</script>

<style lang="scss" scoped>
	@import url("../../../../styles/common.scss");

	.container {
		width: auto;
		display: flex;
		flex-direction: column;
		padding: 0 var(--margin-vertical) 6px;
		gap: 10px 0;
	}

	.waterCell {
		width: auto;
		height: 100px;
		background-color: #cfe9ff;
		padding: 6px 8px;
		border-radius: 8px;
		word-break: break-all;

		&-imageBox {
			width: 100%;
			display: flex;
			align-items: center;
			justify-content: center;

			image {
				width: 100%;
			}
		}
	}
</style>